<template>
    <div class="a-home">
        <div class="title">
            当前首页频道数量:{{channelList.length}}
        </div>
        <div class="table">
            <el-table :data="channelList" border stripe   
                >
                <el-table-column prop="id" label="id" width="40" align="center"  />
                <el-table-column prop="channel_id" label="频道id" width="80" align="center" />
                <el-table-column prop="banner_books_id" label="轮播小说ids" width="150" />
                <el-table-column prop="hot_books_id" label="热门推荐ids" />
                <el-table-column prop="show_books_id" label="展示小说ids" />
                <el-table-column align="center" prop="id" label="操作"  >
                    <template #default="scope">
                        <el-button type="primary" @click="handleEdit(scope.$index, scope.row)"
                        >详情</el-button
                        >
                        <el-button
                        type="warning"
                        @click="handleUpdate(scope.$index, scope.row)"
                        >修改</el-button
                        >
                        <el-button
                        type="danger"
                        @click="handleDelete(scope.$index, scope.row)"
                        >删除</el-button
                        >

                    </template>
                </el-table-column>
            </el-table>
        </div>
    </div>
</template>

<script lang='ts' setup>
import {onMounted, reactive,ref,Ref} from 'vue'
import {homeChannelListApi} from '@/api/admin'
import { ElMessage } from 'element-plus'
import {ChannelItf} from '@/pages/admin/system/ts/home'
let channelList:Ref<ChannelItf[]> = ref([])

let getHomeChannelList = async()=>{
    let result:any = await homeChannelListApi()
    if(result.code == 200){
        channelList.value = result.data
    }
    else{
        console.log(result.err_msg)
        ElMessage({
            type:'error',
            message:'服务器错误!'
        })
    }


}
let handleEdit = (index:number,row:ChannelItf)=>{

}
let handleDelete = (index:number,row:ChannelItf)=>{

}
let handleUpdate = (index:number,row:ChannelItf)=>{

}
onMounted(()=>{
    getHomeChannelList()
})
</script>

<style lang='scss' scoped>
    .a-home{
        .title{
            margin:10px  0 10px 10px;
        }
    }
</style>